/**
 * Created by Administrator on 2017/3/14.
 */
var Button = require('../../../src/libs/button');
var Input = require('../../../src/libs/input');
var Checkbox = require('../../../src/libs/checkbox');
var SelectDropDown = require('../../../src/libs/select-drop-down');
var FormItem = require('../../../src/libs/form-item');
var Steps = require('../complex/steps');
var BorrowApply = require('../complex/borrowApply');
function hasClass(elem, cls) {
    elem = elem || {};
    return new RegExp("\\b" + cls + "\\b").test(elem.className);
};
//添加样式
function addClass(elem, cls) {
    elem = elem || {};
    hasClass(elem, cls) || (elem.className += " " + cls);
    elem.className = elem.className.replace(/^\s|\s$/g, "").replace(/\s+/g, " ");
    return this;
};
//删除样式
function removeClass(elem, cls) {
    elem = elem || {};
    if (hasClass(elem, cls)) {
        elem.className = elem.className.replace(new RegExp("(\\s|^)" + cls + "(\\s|$)"), "");
    }
    return this;
};

var BorrowSuccess = React.createClass({
    getInitialState:function () {
        return{
            url:PageDM.URL.value
        }
    },
    render:function () {
        return(
            <p>
                您已阅读并接受
                <a href={this.state.url.agreement.link}  target='_blank'>《{this.state.url.agreement.name}》</a>
                {this.state.url.agreement2.name?
                    <span>、<a href={this.state.url.agreement2.link} target='_blank'>《{this.state.url.agreement2.name}》</a></span>:""
                }
                约束，并选择委托银行代为发布融资项目信息，请与您的客户经理联系。
            </p>
        )
    }
})

var Root = React.createClass({
    getInitialState: function () {
        return {
            accType: PageDM.accType.value,
            assetTypeId: PageDM.typeSituation.value.assetTypeId,
            disableType: PageDM.typeSituation.value.disableType
        }
    },
    componentDidMount: function () {
        var _this = this;
        UEventHub.on(PageDM.user.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function (v) {
            _this.refs.phoneWrap.innerHTML = v;
        });
        UEventHub.on(PageDM.accType.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function (v) {
            _this.setState({
                accType: v,
                assetTypeId:v
            });
        });
        UEventHub.on(PageDM.typeSituation.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function (v) {
            _this.setState({
                disableType: v.disableType,
                assetTypeId:v.assetTypeId
            })
        });
        UEventHub.on(PageDM.btn.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function(v){
            _this.refs.borrowApply.setState({disabled:v.disabled});
            // _this.getType(v)
        });
        //URL
        UEventHub.on(PageDM.URL.dmbind + UI_EVENT_CONST.SET_UDM_VALUE_EVENT, function(v){
            var checkRef = _this.refs.borrowApply.getRefs('agreement');
            checkRef.setState({
                url:v
            })
            _this.refs.success.setState({
                url:v
            })
        });
        UEventHub.on('showResult', function (bool, result) {
            if (bool) {
                PageDM.user.setValue(result);
                _this.refs.borrow.style.display = "none";
                _this.refs.borrowResult.style.display = "block";
            } else {
                _this.refs.borrow.style.display = "block";
                _this.refs.borrowResult.style.display = "none";
            }

        })
        UEventHub.emit("pageLoad", "hello world!");
    },
    getType: function (val) {
        if (this.state.accType == 0) {
            if (val != 0)
                return;
        } else {
            if (val == 0)
                return;
        }

        this.setState({
            assetTypeId: val
        })
        // PageDM.btn.setValue({type:val});
        PageDM.typeSituation.onClick(val);
    },
    render: function () {
        var _this = this;
        var PageDM = window.PageDM;
        var step = [
            {
                Title: "注册/登录",
                Description: ""
            },
            {
                Title: "选择融资类型",
                Description: "",
                Address: ""
            },
            {
                Title: "签署融资协议",
                Description: " ",
                Address: ""
            },
            {
                Title: "委托银行代为发布",
                Description: ""
            }
        ]
        return (
            <div>
                <div ref="borrow">
                    <div className="form-loan">
                        <div className="container">
                            <div className="index-title"><b></b>我要借款<b></b></div>
                            <div className="tab">
                                <ul className="clearfix" ref="type">
                                    <li className={this.state.assetTypeId == 0 ? "col-1 current" : "col-1"} onClick={function () { _this.getType(0) }}>个人贷款</li>
                                    <li className={this.state.assetTypeId == 1 ? "col-2 current" : "col-2"} onClick={function () { _this.getType(1) }}>企业贷款</li>
                                    <li className={this.state.assetTypeId == 2 ? "col-3 current" : "col-3"} onClick={function () { _this.getType(2) }}>票据</li>
                                    <li className={this.state.assetTypeId == 3 ? "col-4 current" : "col-4"} onClick={function () { _this.getType(3) }}>资管</li>
                                </ul>
                            </div>
                            <BorrowApply ref="borrowApply" type={this.state.accType} able={this.state.disableType} />
                        </div>
                    </div>
                    <div className="index-steps loan">
                        <div className="container">
                            <div className="index-title"><b></b>申请流程<b></b></div>
                            <div className="content clearfix">
                                <div className="ucs-steps financing">
                                    <Steps data={step} />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div ref="borrowResult" className="loan-result container" style={{ display: 'none' }}>
                    <div className="txt">
                        <p>您好，<span ref="phoneWrap"></span>！</p>
                        <p>&nbsp;</p>
                        <BorrowSuccess ref="success"/>
                    </div>
                    <span className="angle angle-top"></span>
                    <span className="angle angle-bottom"></span>
                </div>
            </div>
        )
    }
});
ReactDOM.render(<Root />, document.getElementById('giraffe'));